<?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 <meta name="keywords" content="W3C SVG 1.1 Test Suite testsuite mobile"/>
 <meta name="description" content="W3C SVG 1.1 Test Suite"/>
 <title>
SVG 1.1 test:masking-path-04-b </title>
 <style type="text/css">
 <!--
 body { font-family: "Lucida Grande", verdana, helvetica, sans-serif; line-height: 1.3; text-align: left; margin-top: 0; margin-bottom: 0 }
 .pageTitle { line-height: 1.5; font-weight: bold; margin-bottom: 1em;}
 .pageSubTitle  { color: blue; font-size: 200%; font-weight: bold }
 .openChapter { color: blue; line-height: 1.3; font-weight: bold }
 .openSection { color: blue; line-height: 125%; font-weight: bold }
 .info { color: black; line-height: 1.2; font-size: 90%; }
 p { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .linkbar { text-align: center; margin: 1em 1em 0.25em 1em;}
 blockquote { margin-top:0; margin-bottom:0; padding-top:0; padding-bottom:0 }
 .opscript {margin-left: 3%; margin-right: 3%; }
 .opscript p { margin-top: 0.7em}
 .navbar {background: black; color: white; font-weight: bold}
 -->
 </style>
 </head>
 <body class="bodytext">

	<div class="linkbar"> 
<p>
<a href="full-masking-path-04-b.html">Full version</a>, <a href="basic-masking-path-04-b.html">Basic version</a></p>
<p>Specification link: <a target="spec" href="http://www.w3.org/TR/SVG11/masking.html#ClippingPaths">14.3 Clipping paths</a></p>
 <p>
				<a href="full-masking-path-03-b.html">masking-path-03-b ←</a> 
				<a href="full-index.html">index</a>
				<a href="full-metadata-example-01-b.html">→ metadata-example-01-b</a>
						</p></div>

	<table align="center" border="0" cellspacing="0" cellpadding="10">
		<tr>
			<td align="center" colspan="3">
				<table border="0" cellpadding="8">
					<tr>
						<td align="center" colspan="2" class="pageTitle">
							<h1>masking-path-04-b</h1>
						</td>
					</tr>
					<tr  class="navbar">
						<td align="center">
							SVG Image
						</td>
						<td align="center">
							PNG Image
						</td>
					</tr>
					<tr>
						<td align="right">
   	    		  			
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
            codebase="" id="mySVGViewerObj" width=480 height=360>
    <param name=movie value="../SvgViewer.swf">
    <param name="FlashVars" value="sourceType=url_svg&svgURL=../svggen/masking-path-04-b.svg">
    <param name="wmode" value="transparent">
    <embed play=false name="mySVGViewerObj" 
	    src="../SvgViewer.swf" quality=high wmode="transparent"
	    width=480 height=360 type="application/x-shockwave-flash"
	    FlashVars="sourceType=url_svg&svgURL=../svggen/masking-path-04-b.svg">
    </embed >
</object>
						</td>
						<td align="left">
							<img alt="raster image of masking-path-04-b" src="../png/full-masking-path-04-b.png" width="480" height="360"/>
						</td>
					</tr>
				</table>
			</td>
		</tr>
	</table>

               
<div class="opscript">
			<p>
				This test exercises basic user-specified clip paths, using a text
				string (i.e., content of a 'text' element) as the clip path.
			</p>
			<p>
				There is a rectangular image of a swirly blue pattern with large
				yellow text, "Clip Path" superimposed. The image is a PNG file,
				imported into the picture via the 'image' element.
			</p>
			<p>
				The rendered picture should match the reference image, except for
				possible variations in the labelling text (per CSS2 rules).  (Note
				that the imported PNG image is somewhat granular and low resolution).
			</p>
			<p>
				The test uses the 'rect' element, as well as basic fill (solid primary
				colors), stroke (black 1-pixel lines), font-family (Arial and
				Impact) and font-size properties.
			</p>

		</div>
<div class="linkbar"> <p>
				<a href="full-masking-path-03-b.html">masking-path-03-b ←</a>
				<a href="full-index.html">index</a>
				<a href="full-metadata-example-01-b.html">→ metadata-example-01-b</a>
						</p></div>
</body>
</html>
